<template>
	
	
		<view class="news__list tn-margin-left tn-margin-right tn-margin-bottom">
			<tn-nav-bar class="news_head" fixed :bottomShadow="false">  校友撷英</tn-nav-bar>
			<block v-for="(item, index) in people" :key="index">
				<view class="news__item tn-flex">
					<image class="news__item__image" :src="item.cover" mode="aspectFill"></image>
					<view class="news__item__content">
						<view class="news__item__title">{{ item.title }}</view>
						<view class="news__item__desc">{{ item.desc }}</view>
						<view class="news__item__meta">
							<view>{{ item.time }}</view>
							<view class="tn-color-gray--dark tn-text-sm tn-text-bold">{{ item.status }}</view>
						</view>
					</view>
				</view>
			</block>
		</view>
	
</template>

<script>
export default {
	data() {
		return {
			people: [
				{
					id: 1,
					title: '王喜来',
					desc: '2003级毕业生，任职销售总监。',
					cover: '/static/person1.jpg', // 替换为实际活动封面图路径
					time: '2024-05-16 15:21',
					status: '浏览次数：99'
				},
				{
					id: 2,
					title: '田瑞云',
					desc: '2007级毕业生清华大学生物学博士，主要从事干细胞再生医学相关研究。',
					cover: '/static/person2.jpg',
					time: '2025-05-16 09:30',
					status: '浏览次数：89'
				},
				{
					id: 3,
					title: '黄曹兴',
					desc: '2012级毕业生，并在南京林业大学获得博士学位。',
					cover: '/static/person3.jpg',
					time: '2025-11-28 15:00',
					status: '浏览次数：84'
				},
				{
					id: 4,
					title: '李华靓',
					desc: '中共党员，毕业于吉林农业科技学院，高级农技师。',
					cover: '/static/person4.jpg',
					time: '2025-12-05 16:00',
					status: '浏览次数：85'
				}
			]
		};
	}
};
</script>

<style lang="scss" scoped>
	
.news {

	&__list {
		margin-top: 20rpx;
		padding-top: 80rpx;
	}
	&__item {
		background-color: #ffffff;
		border-radius: 20rpx;
		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
		padding: 20rpx;
		margin-bottom: 25rpx;
	}
	&__item__image {
		width: 240rpx;
		height: 240rpx;
		flex-shrink: 0;
		margin-right: 20rpx;
		border-radius: 12rpx;
	}
	&__item__content {
		flex-grow: 1;
		display: flex;
		flex-direction: column;
	}
	&__item__title {
		font-size: 32rpx;
		font-weight: 600;
		color: #333333;
		margin-bottom: 10rpx;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	&__item__desc {
		font-size: 24rpx;
		color: #666666;
		line-height: 36rpx;
		margin-bottom: 15rpx;
		flex-grow: 1;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	&__item__meta {
		font-size: 22rpx;
		color: #999999;
		display: flex;
		justify-content: space-between;
	}
}
</style>
